<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <script src="js/vue.js" type="text/javascript" charset="utf-8"></script>

</head>

<body>
    <div id="app">
        <!-- key是作为标识，防止vue元素复用 -->
        <p v-for="(item,index) in ages" :data-key="index">{{index}}--{{item}}</p>
        <p v-for="(obj,key,index) in user" key="p2">{{index}}--{{key}}--{{obj}}</p>
        <p v-for="item in student" key="p3">{{item.id}}--{{item.name}}</p>
    </div>
    <script type="text/javascript">
        new Vue({
            el: "#app",
            data: {
                ages: [11, 12, 13, 14, 15],
                user: {
                    name: "萝卜",
                    age: 18,
                    tel: 110
                },
                student: [{
                    id: 1,
                    name: "turnip"
                }, {
                    id: 2,
                    name: "kang"
                }]
            }
        })
    </script>
</body>

</html>